<html>
<head>
    <meta charset="utf-8">
    <script src="../js/jquery.js"></script>
    <script src="../js/jquery.form.js"></script>

</head>
<style>
    
         #comment div{background:rgb(245, 235, 93); width: 55%;height: auto; margin:0 auto;border-radius: 6px;}
         #com div{background:rgb(245, 235, 93); width: 90%;height: 110px; margin:0 auto;border-radius: 6px;}
         
         body{
			background-color:rgb(242, 247, 245);;
		 }
        



</style>

<body>
    <div style="width: 100%;height: auto;background-color: rgb(242, 247, 245);text-align: center;">
        <br>
        <br>
        <div style="width: 90%;height:100%;margin:0 auto;background-color: rgb(242, 247, 245);">
            
            
            <div style="margin:0 auto ;height:auto;width: 35%;">
                <br>
                <br>
                <div style="width: 80%;margin:0 auto;height: 500px;background-color: rgb(138, 145, 247);border-radius: 10px;">
                    <form style="width: 100%;height: 100%"; method="post" action="/awards/upload" enctype="multipart/form-data"; id="formId" >
                    <br>
                   
                    <input type="text" style="width: 80%;height: 40px;font-size: 15px;border-radius: 5px;" placeholder="奖 项 名 称" id="text"
                           name="text"/>

                        <input  name="file" onchange="changepic(this)" type="file" style="opacity: 0;"accept="image/*" id="file">                    <img src="../images/111.jpg" id="show" style="width:80% ;height: 240px; border-radius:10px;" onclick="h()" alt="" >
                    <div style="width:80% ;height: 30px;"></div>
                    <input type="text" style="width:80% ;height: 40px; border-radius: 6px;resize: none;" placeholder="奖项描述(排名 类型……)" ; id="text1"
                           name="text1"/>
                    <div style="width:80% ;height: 30px;"></div>
                    <input type="submit" id="in" style="width: 80%;height: 50px;bottom: 5%;border-radius: 5px;background-color: lightskyblue;" value="奖  项  提  交";  onclick="t()";>
                    </form>

                </div>
            </div>
        </div>

    </div>


</body>
<script>
    var a=0;
   $("#in").click(function () {

           $("#formId").ajaxForm(function (data) {
               if(a==1){
               alert(data.mes);

               if(data.mes=="上传成功！") {
                 text.value = "";
                 text1.value = "";
                 document.getElementById("show").src="../images/111.jpg";
               }}
           });


   });

 
    
    function t(){


        var t1=document.getElementById("text").value;
        var t2=document.getElementById("text1").value;

        var name =document.getElementById('file').files[0].name
        //alert("1111");
        a=0;
        if(t1!=""&&t2!=""&&name!="111.jpg"){

            a=1;
        }
        else{
           
            alert("奖项名称和图片以及奖项描述为必填项");

        }
        

    }//申请
    
    function changepic() {
       
        var reads= new FileReader();
        var f=document.getElementById('file').files[0];
        var a=document.getElementById("file").files[0].size
        if(a>1024*1024*5){
            alert("图片大小不能超过5M")
            return;}
        else {
            
            reads.readAsDataURL(f);
            reads.onload=function (e) {
                 document.getElementById('show').src=this.result;
            };
        }
    }//图片显示

    function h(){
        const file= document.getElementById('file');
        file.click();
    }//选择图片

    function gettime(){
              
                  var isZero = function(num)//私有方法，自动补零
                  {
                      if(num < 10)
                     {
                          num = "0" + num;
                      }
                      return num;
                  }
                  
                  var d = new Date();
                  return d.getFullYear() + "-" + isZero(d.getMonth() + 1) + "-" + isZero(d.getDate()) + " " + isZero(d.getHours()) + ":" + isZero(d.getMinutes()) + ":" + isZero(d.getSeconds());
    }
   
</script>

</html>